1
00:00:00,480 --> 00:00:00,690
All right.

2
00:00:00,690 --> 00:00:07,110
So now let's go ahead and add a little UI, a user interface so that when you get the coin, it's going

3
00:00:07,110 --> 00:00:07,530
to show.

4
00:00:07,530 --> 00:00:10,220
Plus however many points, we can add a plus ten.

5
00:00:10,230 --> 00:00:12,930
Also, there's going to be a sound associated with it.

6
00:00:12,930 --> 00:00:14,160
Let's check it out.

7
00:00:14,370 --> 00:00:15,420
Boom, There we go.

8
00:00:15,420 --> 00:00:16,290
Plus ten.

9
00:00:16,890 --> 00:00:17,970
That's kind of cool.

10
00:00:17,970 --> 00:00:19,620
Let's go ahead and get started.

11
00:00:19,980 --> 00:00:26,820
We are going to create the award label and the sound on the player's machine, also known as the client

12
00:00:26,820 --> 00:00:27,450
machine.

13
00:00:27,450 --> 00:00:31,830
The player is the client, but the coin is on the server.

14
00:00:32,010 --> 00:00:38,630
Everyone can see and possibly get the coin, but only you are going to see the label and hear the sound

15
00:00:38,640 --> 00:00:45,060
In order for client stuff and server stuff to communicate, we need something called a remote event.

16
00:00:45,060 --> 00:00:49,500
It's a gateway between the client and the server, so let's go ahead and do that.

17
00:00:49,500 --> 00:00:57,000
Now, if we take a look at our Explorer window, go down to replicated storage, replicated storage

18
00:00:57,000 --> 00:01:04,770
is able to be seen by the client and the server, and it's a good place for gateways like remote events.

19
00:01:04,770 --> 00:01:07,980
There's also a remote function, but I hardly ever use those.

20
00:01:07,980 --> 00:01:09,540
We're going to use remote events.

21
00:01:09,540 --> 00:01:14,910
Let's hit the plus, sign a replicated storage and I have it under frequently used.

22
00:01:14,910 --> 00:01:21,840
If you don't just go ahead and do our team, look at that remote event and remote functions the other

23
00:01:21,840 --> 00:01:22,830
way of doing it.

24
00:01:23,280 --> 00:01:24,150
There we go.

25
00:01:24,150 --> 00:01:31,800
Let's go ahead and name this remote event award points r e.

26
00:01:31,830 --> 00:01:36,840
This is our gateway between our coin and our user interface.

27
00:01:37,590 --> 00:01:39,340
Let's go to server storage.

28
00:01:39,360 --> 00:01:43,460
Open that up and then find the coin that we spawn into our world.

29
00:01:43,470 --> 00:01:51,090
Let's open that up, open up the collect script and that up at the top we are going to get a variable

30
00:01:51,090 --> 00:01:59,490
for replicated storage, local RRS for replicated storage game, get service replicated storage.

31
00:01:59,490 --> 00:02:01,440
Now we have a variable for that.

32
00:02:01,440 --> 00:02:03,360
We can get the remote event in it.

33
00:02:03,570 --> 00:02:08,310
Let's make another variable called r e for remote event.

34
00:02:08,760 --> 00:02:15,200
We're going to get the variable for replicated storage colon wait for child award points r e.

35
00:02:15,210 --> 00:02:20,130
Now this must be spelt the same as this in replicated storage.

36
00:02:20,130 --> 00:02:22,650
One letter off is not good enough.

37
00:02:22,920 --> 00:02:27,210
So after we get our coin right, this is where we check to see if the player is what?

38
00:02:27,210 --> 00:02:28,320
Touch the coin.

39
00:02:28,500 --> 00:02:32,340
We are going to fire something to the player using the remote event.

40
00:02:32,340 --> 00:02:38,310
We're going to say Ori for remote event colon fire client.

41
00:02:38,580 --> 00:02:44,490
We need to pass in the client that we're going to, so we need to pass in player.

42
00:02:44,520 --> 00:02:46,050
Luckily we got the player.

43
00:02:46,050 --> 00:02:52,620
We also can pass in any information we want after that, very we can send a whole bunch of variables.

44
00:02:52,620 --> 00:02:53,940
We're only going to do one.

45
00:02:53,940 --> 00:02:56,610
We're going to send the ten for the points.

46
00:02:56,910 --> 00:02:57,360
Right?

47
00:02:57,360 --> 00:03:01,920
But I don't like sending literals and using literals and code literal literals.

48
00:03:01,920 --> 00:03:06,210
When you actually put the value right there, when you just type it in, let's go ahead and get a variable

49
00:03:06,210 --> 00:03:07,020
for that.

50
00:03:07,200 --> 00:03:12,510
Let's do p t point val for point value.

51
00:03:12,540 --> 00:03:13,920
Make that ten.

52
00:03:15,470 --> 00:03:23,240
Go ahead and copy that and we'll just replace the p t man point Val with our ten.

53
00:03:23,270 --> 00:03:24,550
Same here.

54
00:03:24,560 --> 00:03:26,600
Now we have less literals in our code.

55
00:03:26,600 --> 00:03:28,700
We still have some down here, but that's fine.

56
00:03:28,700 --> 00:03:30,950
We'll we'll clean them up if we need to.

57
00:03:31,760 --> 00:03:38,420
Let's take a look at our zombie game right here, and we're going to have a little tiny label that's

58
00:03:38,420 --> 00:03:41,570
going to float up when we get a coin.

59
00:03:41,570 --> 00:03:43,100
So let's add that to the game.

60
00:03:43,100 --> 00:03:46,700
Now let's go to Starter Guy or starter guy.

61
00:03:46,730 --> 00:03:48,620
This is where you add your components.

62
00:03:48,620 --> 00:03:54,440
When a player enters a game, the starter guy is cloned to the player and becomes the player guy.

63
00:03:54,830 --> 00:03:58,460
On the starter guy, we can add something called a screen guy.

64
00:03:58,490 --> 00:04:03,620
Go ahead and hit that plus hit screen guy or search if it's not there.

65
00:04:03,620 --> 00:04:05,150
Screen guy.

66
00:04:05,180 --> 00:04:09,800
Now the screen guy covers the screen and holds components.

67
00:04:09,800 --> 00:04:16,000
So now we can add components to the screen guy and you can change this name if you want.

68
00:04:16,010 --> 00:04:17,090
I'm just going to keep it.

69
00:04:17,090 --> 00:04:18,000
Screen guy.

70
00:04:18,020 --> 00:04:19,940
Let's hit the plus again.

71
00:04:19,940 --> 00:04:22,400
Let's add a text label.

72
00:04:22,400 --> 00:04:23,270
There we go.

73
00:04:23,270 --> 00:04:24,680
Here's our tax label.

74
00:04:24,680 --> 00:04:34,010
Let's rename that text label to a weird label ward label that's just going to give us the plus, the

75
00:04:34,010 --> 00:04:35,990
plus ten and stuff like that.

76
00:04:35,990 --> 00:04:41,810
We're going to make a really small let's go and take a look at anchor point.

77
00:04:41,810 --> 00:04:43,010
What's anchor point?

78
00:04:43,010 --> 00:04:45,320
Well, we have two numbers comma delimited.

79
00:04:45,320 --> 00:04:49,730
It is where we connect the component to the screen.

80
00:04:49,760 --> 00:04:54,710
Guy right now at 0000 is the upper left corner.

81
00:04:54,710 --> 00:04:58,640
So that's where it's being attached to our to our screen gooey.

82
00:04:58,640 --> 00:05:03,350
If we change this anchor point, that's a scale from 0 to 1.

83
00:05:03,590 --> 00:05:05,930
Let's do it a11.

84
00:05:06,470 --> 00:05:11,240
Now, the anchor point is right here on the component that move the component up.

85
00:05:11,240 --> 00:05:14,180
I want it right dead center.

86
00:05:14,180 --> 00:05:17,780
So I'm going to make the anchor .0.5 and point five.

87
00:05:17,810 --> 00:05:18,800
There we go.

88
00:05:18,800 --> 00:05:19,910
There's our anchor point.

89
00:05:19,910 --> 00:05:21,110
You can kind of see it.

90
00:05:21,410 --> 00:05:25,580
Now, I want to center this, so I'm going to go down a little bit.

91
00:05:26,180 --> 00:05:32,270
And right where it says position, we have a bunch of numbers, we have X, and if we open up X, we

92
00:05:32,270 --> 00:05:35,000
have scale and offset, we have Y.

93
00:05:35,000 --> 00:05:37,580
If we open up Y, we have scale and offset.

94
00:05:37,580 --> 00:05:45,410
So scale is the percentage, it's the distance of the parent object on a scale from 0 to 1.

95
00:05:45,410 --> 00:05:49,430
So 0.5 is on the center right.

96
00:05:49,430 --> 00:05:56,570
So if we do X with a 0.5 and the X, let's just change its scale here and you should play around with

97
00:05:56,570 --> 00:05:57,890
every place you can change it.

98
00:05:57,890 --> 00:05:59,120
It's very flexible.

99
00:05:59,120 --> 00:06:01,100
Robots is very flexible like this.

100
00:06:01,100 --> 00:06:06,740
I'm going to hit 0.5 on the scale boom, that's halfway on my x axis.

101
00:06:06,770 --> 00:06:09,920
Now I'm going to do 0.5 on my Y scale.

102
00:06:10,250 --> 00:06:11,570
0.5.

103
00:06:11,840 --> 00:06:13,010
There we go.

104
00:06:13,010 --> 00:06:16,730
Pixel offset just adds pixels to that number.

105
00:06:16,730 --> 00:06:19,790
So if we add pixels, don't do this because we're going to delete it.

106
00:06:19,790 --> 00:06:25,550
But let's say let's add 20 to our offset, it just shifted at 20 pixels.

107
00:06:25,550 --> 00:06:27,380
I'm going to put it back to zero.

108
00:06:27,410 --> 00:06:28,910
I just wanted you to see it.

109
00:06:28,910 --> 00:06:31,010
Let's go down to scale.

110
00:06:31,010 --> 00:06:33,050
Scale are not scale size.

111
00:06:33,050 --> 00:06:34,670
Size is the same thing.

112
00:06:34,670 --> 00:06:35,210
Size.

113
00:06:35,210 --> 00:06:40,760
We have an X and Y, we open those up, we have a scale and an offset scale and an offset.

114
00:06:40,760 --> 00:06:42,410
This is in pixels.

115
00:06:42,410 --> 00:06:44,420
I think I'm going to keep it in pixels.

116
00:06:44,420 --> 00:06:52,730
I'm not going to use scale, I'm going to make the offset on the x 50.

117
00:06:53,390 --> 00:06:59,450
So that's 50 pixels on the X, there we go and it's already 50 pixels on the Y.

118
00:06:59,690 --> 00:07:00,800
That's perfect.

119
00:07:00,800 --> 00:07:04,040
It's going to be a little square.

120
00:07:04,340 --> 00:07:07,070
Let's check to see if our position has changed.

121
00:07:07,070 --> 00:07:08,060
It has not.

122
00:07:08,060 --> 00:07:10,280
That's because the anchor point was in the center.

123
00:07:10,280 --> 00:07:13,670
If the anchor point was up here, we would have to reposition.

124
00:07:13,670 --> 00:07:16,550
That's just kind of an artifact of where the anchor point is.

125
00:07:16,550 --> 00:07:19,820
And if you size something, if it's going to change position or not.

126
00:07:20,390 --> 00:07:20,810
All right.

127
00:07:20,810 --> 00:07:24,350
Now let's go down to text.

128
00:07:25,020 --> 00:07:28,350
So we have text here font face.

129
00:07:29,690 --> 00:07:33,980
I'm going to go with this comic.

130
00:07:34,660 --> 00:07:38,020
Whatever you call it, that's a pretty good text.

131
00:07:38,230 --> 00:07:40,760
If you lose it, you won't be able to click it again.

132
00:07:40,780 --> 00:07:43,270
You have to come over here and click it that way.

133
00:07:43,900 --> 00:07:46,240
And what else should we change on the text?

134
00:07:47,780 --> 00:07:51,020
Let's change how big the text is.

135
00:07:51,050 --> 00:07:52,880
I'm going to do something crazy.

136
00:07:53,000 --> 00:07:55,820
I'm going to hit something called Text scaled.

137
00:07:56,180 --> 00:07:59,090
And the robots guesses how big they should make it.

138
00:07:59,330 --> 00:08:01,460
I'm also going to change the color to that.

139
00:08:01,490 --> 00:08:03,170
Let's here, let's see this text.

140
00:08:03,170 --> 00:08:04,310
Color three.

141
00:08:04,760 --> 00:08:05,870
Press that.

142
00:08:06,490 --> 00:08:07,660
Yellow.

143
00:08:08,760 --> 00:08:09,900
Ban yellow tags.

144
00:08:09,900 --> 00:08:11,370
Hardly can see it.

145
00:08:12,160 --> 00:08:12,580
Hmm.

146
00:08:12,610 --> 00:08:15,520
Maybe if we get a little outline around the text.

147
00:08:15,550 --> 00:08:15,940
Text?

148
00:08:15,940 --> 00:08:17,380
Stroke, transparency.

149
00:08:17,560 --> 00:08:20,200
Let's make it one that's a little better.

150
00:08:21,290 --> 00:08:22,280
But you know what?

151
00:08:22,280 --> 00:08:26,780
I'm going to make this whole thing invisible except for the text.

152
00:08:27,140 --> 00:08:34,760
Before I do that, I'm going to give it some example text of kind of what it's going to be like in the

153
00:08:34,760 --> 00:08:35,420
game.

154
00:08:35,420 --> 00:08:38,660
Let's say like a plus 11.

155
00:08:38,660 --> 00:08:41,060
We're going to make it slightly different than what it is in the game.

156
00:08:43,030 --> 00:08:47,260
Yeah, that's not bad, but let's make the background transparent.

157
00:08:47,260 --> 00:08:55,270
Let's hit a weird label and then we'll go to background transparency.

158
00:08:55,390 --> 00:08:56,980
Make that one.

159
00:08:58,180 --> 00:09:00,070
Yeah, that's what I'm talking about.

160
00:09:00,070 --> 00:09:06,250
Now, I could see that just appearing when I get the coin and then floating on up.